<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ include file="commons/import_taglibs.jsp" %>
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="${BASE }/sys/index">${PROJECT_NAME }</a>
    </div>
    <!-- Top Menu Items -->
    <ul class="nav navbar-right top-nav">
        <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-envelope"></i> <b
                    class="caret"></b></a>
            <ul class="dropdown-menu message-dropdown">
                <!--
                        <li class="message-preview">
                            <a href="#">
                                <div class="media">
                                    <span class="pull-left">
                                        <img class="media-object" src="http://placehold.it/50x50" alt="">
                                    </span>
                                    <div class="media-body">
                                        <h5 class="media-heading"><strong>${currentUser.name }</strong>
                                        </h5>
                                        <p class="small text-muted"><i class="fa fa-clock-o"></i> Yesterday at 4:32 PM</p>
                                        <p>Lorem ipsum dolor sit amet, consectetur...</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="message-footer">
                            <a href="#">Read All New Messages</a>
                        </li>
                        -->
            </ul>
        </li>
        <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-bell"></i> <b class="caret"></b></a>
            <ul class="dropdown-menu alert-dropdown">
                <li>
                    <a href="#">Alert Name <span class="label label-default">Alert Badge</span></a>
                </li>
                <li>
                    <a href="#">Alert Name <span class="label label-primary">Alert Badge</span></a>
                </li>
                <li>
                    <a href="#">Alert Name <span class="label label-success">Alert Badge</span></a>
                </li>
                <li>
                    <a href="#">Alert Name <span class="label label-info">Alert Badge</span></a>
                </li>
                <li>
                    <a href="#">Alert Name <span class="label label-warning">Alert Badge</span></a>
                </li>
                <li>
                    <a href="#">Alert Name <span class="label label-danger">Alert Badge</span></a>
                </li>
                <li class="divider"></li>
                <li>
                    <a href="#">View All</a>
                </li>
            </ul>
        </li>
        <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user"></i> ${currentUser.name }
                <b class="caret"></b></a>
            <ul class="dropdown-menu">
                <li>
                    <a href="#"><i class="fa fa-fw fa-user"></i> Profile</a>
                </li>
                <li>
                    <a href="#"><i class="fa fa-fw fa-envelope"></i> Inbox</a>
                </li>
                <li>
                    <a href="#"><i class="fa fa-fw fa-gear"></i> Settings</a>
                </li>
                <li class="divider"></li>
                <li>
                    <a href="${BASE }/sys/logout"><i class="fa fa-fw fa-power-off"></i> Log Out</a>
                </li>
            </ul>
        </li>
    </ul>
    <!-- Sidebar Menu Items - These collapse to the responsive navigation menu on small screens -->
    <div class="collapse navbar-collapse navbar-ex1-collapse">
        <ul class="nav navbar-nav side-nav">
            <li>
                <a href="${BASE }/sys/index"><i class="fa fa-fw fa-dashboard"></i> 首页</a>
            </li>
            <%--
            <li>
                <a href="javascript:;" data-toggle="collapse" data-target="#system_management">
                    <i class="fa fa-fw fa-gear"></i> 系统管理 <i class="fa fa-fw fa-caret-down"></i>
                </a>
                <ul id="system_management" class="collapse in">
                    <li>
                        <a href="${BASE }/sys/user/list"><i class="fa fa-users"></i> 用户管理</a>
                    </li>
                    <li>
                        <a href="${BASE }/sys/log/list"><i class="fa fa-calendar"></i> 日志管理</a>
                    </li>
                </ul>
            </li>
            --%>
            <li>
                <a href="javascript:;" data-toggle="collapse" data-target="#system_management">
                    <i class="fa fa-fw fa-gear"></i> 部署管理 <i class="fa fa-fw fa-caret-down"></i>
                </a>
                <ul id="system_management" class="collapse in">
                    <li>
                        <a href="javascript:_toPage('/deploy/project/list');">
                            <i class="fa fa-users"></i> 项目管理
                        </a>
                    </li>
                    <li>
                        <a href="javascript:_toPage('/deploy/info/add');">
                            <i class="fa fa-users"></i> 执行部署
                        </a>
                    </li>
                    <li>
                        <a href="javascript:_toPage('/deploy/info/index');">
                            <i class="fa fa-users"></i> 部署历史
                        </a>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
    <!-- /.navbar-collapse -->
</nav>
<script>
    /**
     * 跳转
     * @param _url 地址
     * @private
     */
    function _toPage(_url){
        // loading...
        layer.load(0, { shade: [0.1, '#000'] });
        $('#page-wrapper').load(_url, function(){
            // 关闭loading效果
            setTimeout(function(){ layer.closeAll('loading'); }, 300);
        });
    }
</script>